<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no,minimal-ui">
<title>长按-mobile</title>
<style type="text/css">
div{width:100px; height:44px; margin:10px; background:pink;}
</style>
<script type="text/javascript" src="../../assets/js/jquery-1.7.2.min.js"></script>
<script type="text/javascript">
function longPress(){ 
    timeOutEvent = 0; 
    alert("长按事件触发");
} 
$(function(){
	$("#touchArea").on({
        touchstart: function(e){
            timeOutEvent = setTimeout("longPress()",500);
           	e.preventDefault(); //阻止浏览器的默认事件
        },
        touchmove: function(){
			clearTimeout(timeOutEvent); 
			timeOutEvent = 0; 
        },
        touchend: function(){
            clearTimeout(timeOutEvent);
            if(timeOutEvent!=0){ 
                alert("你这是点击，不是长按"); 
            } 
            return false; 
        }
    })
})
</script>
</head>
<body>
<div id="touchArea">abc</div>
</body>
</html>

